<template>
  <!-- mixins:抽离组件的js部分 抽离data,methods,生命周期，计算属性....
      混入过程中如果出现命名冲突，以当前组件为主,生命周期会都执行

      全局抽离：所有的组件都有全局混入的代码,实际 开发：公共的处理：公共变量（一般不做修改）,公共的方法，公共的过滤器，公共的自定义指令....
         Vue.mixin({
          抽离的代码
         })

      局部抽离:
        import xxx from '抽离的代码路由'
        mixins:[xxx]

  -->
  <div>
    首页---
    <br>
    <!-- <button @click="add">点击+1</button> -->
    {{ num }}
    <hr>
    <h3>{{ xxx }}</h3>
  </div>
</template>
<script>
import xxx from './mixin/index'
export default {
  mixins: [xxx],
  data() {
    return {
      num: 999
    }
  },
  created() {
    console.log('首页created')
  }

}
</script>
<style>
</style>
